//计数器
sum = 20

// 商品数组
ss = []

// 轮播图数组
lb = []

// 轮播图渲染
function xrlb(inin) {
    su = {
        list: [...lb]
    }
    let html = template('see', su)
    document.querySelector('.swiper-wrapper').innerHTML = html
    var mySwiper = new Swiper('.swiper-container', {
        loop: true, // 循环模式选项
        autoplay: {
            delay: 1000, //1秒切换一次
        },
        // 如果需要分页器
        pagination: {
            el: '.swiper-pagination',
            clickable: true,
        },

        // 如果需要前进后退按钮
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
            hideOnClick: true,
        },

        // 如果需要滚动条
        scrollbar: {
            el: '.swiper-scrollbar',
        },
    })

}

// 渲染商品界面
function xrjm(inin) {

    su = {
        list: [...ss]
    }
    let html = template('ser', su)
    document.querySelector('#content').innerHTML = html
        // console.log(html)

}

// 获取首页商品数据
$.ajax({
    type: 'get',
    url: 'http://www.xiongmaoyouxuan.com/api/tab/1?start=0',
    success: function(result) {
        ss = [...(result.data.items.list)]
        xrjm()
            //        console.log(lb)
            // console.log(result.data.items.list)
    }
})

// 获取轮播图数据
$.ajax({
    type: 'get',
    url: 'http://www.xiongmaoyouxuan.com/api/tab/1?start=0',
    headers: {
        'x-platform': 'pc'
    },
    success: function(result) {
        result.data.banners.forEach(item => {
            lb.push(item)
        })
        xrlb()
            //        console.log(lb)
            // console.log(result.data.items.list)
    }
})

// 加载更多商品单机事件
$('#button').on('click', function() {
    $.ajax({
        type: 'get',
        url: `http://www.xiongmaoyouxuan.com/api/tab/1/feeds?start=${sum}&sort=0`,
        success: function(result) {
            ss = [...ss, ...result.data.list]
            console.log(result.data.list)
            console.log(ss)
            xrjm()
        }
    })
    sum += 20
})

// 返回顶部功能实现
$('.plug-in').on('click', function() {
    let box1 = document.documentElement.scrollTop
    let box = setInterval(() => {
        document.documentElement.scrollTop = box1
        box1 -= 20
        if (box1 <= 0) {
            clearInterval(box)
        }
    }, 1)
})

// 滚动距离到xxx显示返回顶部按钮
window.onscroll = function() {
    if (window.scrollY < 400) {
        $('.plug-in').addClass('yyy')
    }
    if (window.scrollY >= 400) {
        $(".plug-in").removeClass('yyy');
    }
}


//跳转到商品详情页
function onpr(id) {
    location.href = './details.html?id=' + id
}